<template>
  <div class="column_permission-content" ref="permisssTab">
    <permission ref="psList"></permission>
  </div>
  <div class="saveBtn" :style="styleWidth">
    <a-button type="primary" @click="saveSetting" :disabled="assignable">
      保存
    </a-button>
  </div>
</template>
<script lang="ts" setup>
import { ref, onMounted, } from "vue"
import permission from './permission/index.vue'
import request from "@/api/index";
import { useRoute } from 'vue-router';
import getters from '@/store/getters';
import { useFixeWidth, styleWidth } from '@/hooks/useFixeWidth';
import { message } from "ant-design-vue";
// type
interface dataSourceType {
  [propName: string]: any;
}
//props
const props = defineProps({
  selectedOrgKeys: {
    type: [Number, String]
  }
})
//emit 
const emit = defineEmits(['assignable'])
// data
const { query } = useRoute();
const userInfo = getters.userInfo();
//tabs
const psList = ref();
// 保存安详信息设置
const assignable = ref<Boolean>(false);
//methods
const saveSetting = () => {
  let tabActive = psList.value.tabActive;
  let orgTreeTable = []; // 组织权限
  let userTreeTable = []; // 用户权限
  let permUpdateList: dataSourceType[] = [];
  let params: dataSourceType = {
    dataType: query.dataType,
    channelId: query.id,
    "permUpdateList": permUpdateList || [],
  }
  if (tabActive == 1) {
    orgTreeTable = psList.value.orgTable.dataSource;
    loopPerssionTree(orgTreeTable, permUpdateList);
    saveOrgTree(params);
  } else {
    userTreeTable = psList.value.userTable.dataSource;
    loopPerssionTree(userTreeTable, permUpdateList);
    saveUserTree(params);
  }

}
// 保存组织权限 editChannelDocumentOrgUserPerm
const saveOrgTree = (params: dataSourceType) => {
  request.editChannelDocumentOrgPerm(params).then((res: dataSourceType) => {
    if (res.code == '00000 00000') {
      message.success(res.message);
      // 保存完成后刷新页面
      psList.value.getTreeData();
    } else {
      message.error(res.message);
    }
  }).catch((err: any) => {
    throw new Error(err)
  })
}
// 保存用户权限 editChannelDocumentOrgUserPerm
const saveUserTree = (params: dataSourceType) => {
  request.editChannelDocumentOrgUserPerm(params).then((res: dataSourceType) => {
    if (res.code == '00000 00000') {
      message.success(res.message);
      // 保存完成后刷新页面
      psList.value.getTreeData();
    } else {
      message.error(res.message);
    }
  }).catch((err: any) => {
    throw new Error(err)
  })
}
// loop 扁平化 站点、栏目、文档权限
const loopPerssionTree = (data: dataSourceType[], list: dataSourceType[]) => {
  console.log(JSON.parse(JSON.stringify(list)), 888)
  data.forEach((item: dataSourceType) => {
    let obj = {
      id: item.id,
      linePerms: [] as dataSourceType[]
    }
    item.linePerms.forEach((data: dataSourceType, index: number) => {
      obj.linePerms.push({
        operationId: +index + 1,
        selected: data.hasPerm
      })
    });
    list.push(obj);

    item.children && item.children.length ? loopPerssionTree(item.children, JSON.parse(JSON.stringify(list))) : '';

  })
}
// mounted
onMounted(() => {
  useFixeWidth();
})
</script>

<style lang="less" scoped>
.column_permission-content {
  background-color: #fff;
  height: calc(100% - 136px);
  padding-right: 24px;
  padding-bottom: 24px;
}

.saveBtn {
  position: fixed;
  bottom: 0;
  height: 48px;
  background-color: #fff;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
</style>
